
/* 头部搜索 */
.headerMiddle{
  margin-top: 20px;
  display: flex;
  justify-content: space-between;
}
.myCart{
  width: 150px;
  height: 40px;
  line-height: 40px;
  background-color: #c81623;
  padding: 0px 10px;
  margin-top: 20px;
}
.myCart a{
  color: #fff;
  font-size: 14px;
  margin: 0 5px;
}
.search{
  display: flex;
  position: relative;
  margin-top: 10px;
}
.searchInput,.search a{
  height: 38px;
  line-height: 38px;
  position: absolute;
}
.searchInput{
  width: 450px;
  border: 2px solid #c81623;
  left: 490px;
  padding-left: 5px;
  font-size: 12px;
}
.search a{
  display: inline-block;
  width: 80px;
  background-color: #c81623;
  color: #fff;
  text-align: center;
  left: 940px;
}
/* 头部选项卡 */
.headerTab{
  display: flex;
  margin-top: 100px;
}
.headerTab li a{
  display: inline-block;
  height: 40px;
  line-height: 40px;
  font-size: 16px;
  padding: 0 25px;
  color: #666;
}
.headerTab li a:hover{
  color: #c81623;
}
/* 轮播图+大图 */
.banner{
  width: 1200px;
  margin: auto;
  position: relative;
  cursor: pointer;
}
.banner div[alt]{
  opacity: 0;
  transition-duration: 1s;
}
.banner1,.banner2{
  position: absolute;
  text-align: center;
  width: 100%;
}
/* 箭头 */
.arrow{
  position: relative;
  height: 320px;
}
.arrowLeft,.arrowRight{
  width: 35px;
  height: 70px;
  position: absolute;
  background: rgba(0,0,0,0.5) url(../imgs/index/arrow-left.png) no-repeat center;
  top: 50%;
  margin-top: -35px;
  cursor: pointer;
  border-radius: 3px;
}
.arrowLeft{
  background-image: url(../imgs/index/arrow-left.png);
  left: 5px;
}
.arrowRight{
  background-image: url(../imgs/index/arrow-right.png);
  right: 5px;
}
.arrowLeft:hover,.arrowRight:hover{
  background-color: rgba(0,0,0,1);
}
/* 大图 */
.big_img{
  width: 1200px;
  margin: 0 auto 10px;
}

/* 热销专区 */
#container{
  width: 1200px;
  margin: 10px auto 50px;
  position: relative; 
}
.f1_title{
  width: 100%;
  display: flex;
  justify-content: space-between;
  margin-bottom: 10px;
}
.f1_title div{
  font-size: 22px;
}
#container .f1_title ul{
  display: flex;
  justify-content: space-around;
  font-size: 12px;
}
.f1_title ul li{
  margin-left: 10px;
}
#container .f1_title ul li a{
  text-decoration: none;
  color: #666;
}
.content{
  display: flex;
}
.content .content_left{
  flex-basis: 20%;
}
.content .content_right{
  flex-basis: 80%;
  height: 535px;
  box-sizing: border-box;
  display: flex;
  justify-content: space-around;
  flex-wrap: wrap;
}
.content_right .spec{
  flex-basis: 25%;
  border: 1px solid #ccc;
  border-left: none;
}
.content_right .spec:hover{
  color: #c81623;
  cursor: pointer;
}
.content_right>div:nth-child(4)~div{
  border-top: none;
}
.spec .product_img{
  width: 100%;
  text-align: center;
}
.spec .product_img img{
  height: 164px;
  margin: 12px auto;
}
.spec .product_img img:hover{
  transform: translateX(10px);
  transition: linear 0.6s;
}
.spec p{
  text-align: center;
  margin: 10px 0;
  font-size: 14px;
}
.spec .price{
  color: red;
}
/* 底部图片 */
.footer_img{
  width: 1200px;
  margin: auto;
  margin-bottom: 20px;
}
/* 笔记本/平板 */
.compute_pad{
  width: 1200px;
  margin: auto;
}
.compute_pad p{
  font-size: 22px;
}
.compute_pad .compute{
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}
.compute_pad .compute>div{
  flex-basis: 24%;
  height: 350px;
  border: 1px solid #ccc;
  padding: 10px;
  margin-top: 15px;
  text-align: center;
}
.compute_pad .compute>div:hover{
  cursor: pointer;
  color: #c81623;

}
.compute>div>img{
  width: 90%;
}
.compute>div>p{
  font-size: 12px;
  height: 40px;
  text-align: left;
  margin-top: 10px;
}
.compute div .com_price{
  font-size: 22px;
  color: #f00;
}

/* 底部新闻 */
.footer_news{
  width: 1200px;
  margin: 15px auto 40px;
  display: flex;
  justify-content: space-around;
}
.footer_news>div{
  flex-basis: 50%;
  height: 215px;
  border: 1px solid #ccc;
  margin-top: 5px;
  padding: 10px;
}
.footer_news>div:last-child{
  border-left: none;
}

.footer_left h2,.footer_right h2{
  font-size: 16px;
  font-weight: 700;
  margin-bottom: 10px;
}
.footer_left .news,.footer_right .news{
  width: 100%;
  height: 95px;
  display: flex;
}
.footer_left .news img,
.footer_right .news img{
  width: 125px;
  height: 95px;
  margin-right: 20px;
}
.news a{
  text-decoration: none;
  color: #666;
  font-size: 14px;
}
.news div p{
  margin-top: 10px;
  font-size: 12px;
  height: 60px;
  line-height: 20px;
  color: #999;
}
.List{
  display: flex;
}
.footer_left ul,
.footer_right ul{
  list-style: square;
  font-size: 12px;
}
.footer_left ul:last-child,
.footer_right ul:last-child{
  margin-left: 50px;
}
.footer_left ul li,
.footer_right ul li{
  margin: 10px 0;
  margin-left: 20px;
} 
.footer_left ul li a,
.footer_right ul li a{
  text-decoration: none;
  color: #666;
}
/* 底部 */
.footer{
  width: 100%;
  height: 157px;
  border-top: 1px solid #ccc;
  text-align: center;
}
.footer ul{
  display: flex;
  justify-content: center;
  margin-top: 30px;
}
.footer ul li{
  font-size: 12px;
  padding: 0 10px;
}
.footer ul li:nth-child(1)~li{
  border-left: 1px solid #ccc;
}
.footer ul li a{
  text-decoration: none;
  color: #666;
}
.footer p{
  margin-top: 20px;
  font-size: 12px;
}
.footer .authentication{
  display: flex;
  justify-content: center;
  margin-top: 20px;
}
.footer .authentication img{
  margin: 0 8px;
}

/* 当页面滚动到多少距离时显示id为hidden的div */
.hidden{
  position: fixed;
  top: 50%;
  left: 16%;
  margin-top: -19px;
}
#hidden{
  background: #b1191a;
  width: 38px;
  height: 38px;
  text-align: center;
  display: block;
  color: #fff;
  font-size: 14px;
  padding: 3px 2px 2px 2px;
}

